import VueRouter from 'vue-router'
import Vue from 'vue'
import Frame from "./components/frame.vue"


const Index = ()=>import( './components/Index.vue')
const MessageBoard = ()=>import( './components/MessageBoard.vue')
const Mine = ()=>import('./components/Mine.vue')
const Tools = ()=>import('./components/Tools.vue')
Vue.use(VueRouter)

const router = new VueRouter({
    // mode: 'history',
    routes: [
        {
            path: '/',
            redirect: '/index'
        },
        {
            path: '', component: Frame,
            children: [
                {
                    path: '/index',
                    component: Index,
                    meta: {
                        title: "前端爱好者小王"
                    }
                },
                {
                    path: '/mine',
                    component: Mine,
                    meta: {
                        title: "王帅鸣|个人简历"
                    }
                },
                {
                    path: '/messageboard',
                    component: MessageBoard,
                    meta: {
                        title: "小王的留言板"
                    }
                },
                {
                    path: '/tools',
                    component: Tools,
                    meta: {
                        title: "前端工具箱"
                    }
                }
            ]
        },

    ]
})
router.beforeEach((to, from, next) => {
    /* 路由发生变化修改页面meta */
    if (to.meta.content) {
        let head = document.getElementsByTagName('head');
        let meta = document.createElement('meta');
        meta.content = to.meta.content;
        head[0].appendChild(meta)
    }
    /* 路由发生变化修改页面title */
    if (to.meta.title) {
        document.title = to.meta.title;
    }
    next()
});
export default router